Últimos comentarios con..."Fecha,nombre,título de la entrada, y un breve resumen"

En vista de los problemas que nos puede ocasionar utilizar alojamientos externos he actualizado esta entrada incluyendo la idea de J.Miur de añadir los scripts en nuestra propia plantilla, en este caso el script de últimos comentarios lo añadiremos en un gadget.
La forma de aplicarlo es muy sencilla, editamos un nuevo gadget escogiendo la opción de HTML y en su interior añadimos los siguiente.

<script type="text/javascript">
function showrecentcomments(json) {
for(var i=0; i < a_rc; i++) {
var b_rc=json.feed.entry[i];var c_rc;
if(i==json.feed.entry.length)break;
for(var k=0; k < b_rc.link.length; k++) {
if(b_rc.link[k].rel=='alternate') {
c_rc=b_rc.link[k].href;break;
}
}
c_rc=c_rc.replace("#","#comment-");
var d_rc=c_rc.split("#");
d_rc=d_rc[0];
var e_rc=d_rc.split("/");
e_rc=e_rc[5];
e_rc=e_rc.split(".html");
e_rc=e_rc[0];
var f_rc=e_rc.replace(/-/g," ");
f_rc=f_rc.link(d_rc);
var g_rc=b_rc.published.$t;
var h_rc=g_rc.substring(0,4);
var i_rc=g_rc.substring(5,7);
var j_rc=g_rc.substring(8,10);
var k_rc=new Array();
k_rc[1]="Ene"; k_rc[2]="Feb"; k_rc[3]="Mar"; k_rc[4]="Abr";
k_rc[5]="May"; k_rc[6]="Jun"; k_rc[7]="Jul"; k_rc[8]="Ago";
k_rc[9]="Sep"; k_rc[10]="Oct"; k_rc[11]="Nov"; k_rc[12]="Dic";
if("content" in b_rc){
var l_rc=b_rc.content.$t;
} else if("summary" in b_rc) {
var l_rc=b_rc.summary.$t;
} else var l_rc="";
var re=/<\S[^>]*>/g;
l_rc=l_rc.replace(re,"");
if(m_rc==true)document.write(k_rc[parseInt(i_rc,10)]+' '+j_rc+' ');
document.write('<li><b>' + b_rc.author[0].name.$t + '</b>');
if(n_rc==true)document.write(f_rc);
document.write(':<br/>');
document.write('<a href="' + c_rc + '">');
if(l_rc.length < o_rc) {
document.write(l_rc);
} else {
l_rc=l_rc.substring(0,o_rc);
var p_rc=l_rc.lastIndexOf(" ");
l_rc=l_rc.substring(0,p_rc);
document.write(l_rc+'&hellip;');
}
document.write('</a></li>');
}
}
</script>

<script type="text/javascript">
var a_rc=10;
var m_rc=false;
var n_rc=false;
var o_rc=50;
</script>

<script src="gemablog-.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Podemos modificar lo siguiente:
var a_rc=10; // la cantidad de comentarios
var m_rc=false; // con true se muestra la fecha
var n_rc=false; // con true mostramos el título del post
var o_rc=50; // caracteres que se muestran
Donde dice:gemablog-.blogspot.com cámbialo por la dirección de tu blog.


Una vez guardamos los cambios si queremos personalizarlo marcamos para expandir la plantilla localizamos el siguiente código y añadimos lo que está marcado en color rojo.

<b:widget id='aquí pondrá la id de nuestro widget' locked='false' title='aquí pondrá el título que tenemos en la sidebar' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ultimosComentarios'><data:content/></div>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Guardamos de nuevo los cambios y nos situamos justo antes de ]]></b:skin> allí añadimos los estilos.

#ultimosComentarios li { /* es el bloque que contiene cada comentario*/
border-bottom: 1px solid #C0C0C0;
border-top: 1px solid #C0C0C0;
margin-bottom: -1px !important;
padding: 0px 0 0px 15px;
}

#ultimosComentarios b { /* autor del comentario */
color:#940f04;
}

#ultimosComentarios li:hover { /* añade efecto al pasar el ratón sobre cada bloque de comentario*/
color:#ccc;
}

#ultimosComentarios a, #ultimosComentarios a:link, #ultimosComentarios a:visited {
color:#333; /* es el texto del comentario */
}

#ultimosComentarios a:hover {/* añade efecto sobre el texto del comentario */
color:#940f04;
}

Recuerda que en los estilos debes añadir el mismo id que añadimos en este caso ultimosComentarios de lo contrario no se producen los cambios en los estilos.